<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>demo</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimal-ui"/>
	<link href="http://apps.bdimg.com/libs/fontawesome/4.4.0/css/font-awesome.min.css" rel="stylesheet">
	<!-- loading css文件中的样式会在bundle加载成功以后才会渲染，所以写成内联样式 -->
	<style>
		#app {min-height:32rem;} /*及时遮住loading animation*/
		.load-index {position:absolute;top:0;left:0;right:0;bottom:0;width:6rem;height:6rem;margin:auto;}
		.load-index img {width:100%;-webkit-animation:loadIndexA 3s infinite;}
		@-webkit-keyframes loadIndexA{
			0% {-webkit-transform: rotate(0);}
			70% {-webkit-transform: rotate(360deg);}
			100% {-webkit-transform: rotate(360deg);}
		}
	</style>
</head>
<body>
	<div class="load-index">
	<!-- loading css文件中的样式会在bundle加载成功以后才会渲染，所以写成内联样式 -->
		<img src="img/logo-index.png">
	</div>
    <div id="app">
    	<my-header title="联诚"></my-header>
    	<my-footer></my-footer>
    	<my-banner></my-banner>
    	<my-content></my-content>
        <router-view></router-view>
    </div>
    <!-- 好奇怪！HtmlWebpackPlugin会将webpack打包好的js文件注入到body区域下的第一个script标签内 -->
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</body>
<script>
	(function(){
		
	})();
</script>
</html>